<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui">

<f:view>
	<ui:composition template="layout/layout.xhtml">
		<ui:define name="body">

			<p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();" />
			<p:dialog modal="true" widgetVar="statusDialog" header="Status" draggable="false" closable="false">
				<p:graphicImage value="/design/ajaxloadingbar.gif" />
			</p:dialog>
			<p:growl id="growl" showDetail="true" sticky="true" autoUpdate="true" life="500" />

			<h:form id="formTarea" styleClass="todo" rendered="#{loginBean.usuarioLogueado}">

				<p:panel header="#{msg.titulo_nueva_tarea}">

					<p:panelGrid columnClasses="labelFormTarea, valorFormTarea" columns="2">

						<p:outputLabel value="#{msg.campo_requerido} #{msg.titulo_titulo} #{msg.dos_puntos}" styleClass="todo" />
						<p:inputText id="titulo" value="#{tareaBean.tarea.titulo}" disabled="#{tareaBean.tareaPadre != null}" styleClass="tamanio100" required="true"
							label="#{msg.titulo_titulo}" />

						<p:outputLabel styleClass="tareaForm" value="#{msg.campo_requerido} #{msg.titulo_descripcion} #{msg.dos_puntos}" />
						<p:inputTextarea id="descripcion" value="#{tareaBean.tarea.descripcion}" styleClass="textBoxArea" required="false"
							label="#{msg.titulo_descripcion}" disabled="#{tareaBean.tareaPadre != null}">
							<f:validateLength minimum="15" />
						</p:inputTextarea>

						<p:outputLabel styleClass="tareaForm" value="#{msg.titulo_comentario} #{msg.dos_puntos}" />
						<p:inputTextarea id="descripcionNota" value="#{tareaBean.notaTarea.descripcion}" styleClass="textBoxComentario" required="false"
							label="#{msg.titulo_comentario}">
							<f:validateLength minimum="15" />
						</p:inputTextarea>
					</p:panelGrid>


					<p:panelGrid columns="4" id="t1" columnClasses="labelFormTarea, valorCheck, labelFormTarea, valorRestamteTarea">
					</p:panelGrid>

				</p:panel>

				<p:panelGrid columns="2" columnClasses="tamanio50, tamanio50">
					<p:outputPanel id="treePanel" autoUpdate="true">
						<p:panel header="#{msg.titulo_seleccione_usuario_grupo_area}">
							<p:tree styleClass="tamano100" value="#{tareaBean.root}" var="node" id="checkboxTree" selectionMode="checkbox"
								selection="#{tareaBean.selectedNodes}" rendered="#{tareaBean.areaTrabajoSession != null}">

								<p:ajax event="select" listener="#{tareaBean.onNodeSelect}" update=":formTarea:cantidadRecursos" />
								<p:ajax event="unselect" listener="#{tareaBean.onNodeUnselect}" update=":formTarea:cantidadRecursos" />
								<p:treeNode id="treeNode">
									<h:outputText value="#{node}" />
								</p:treeNode>
							</p:tree>

							<p:outputLabel rendered="#{tareaBean.areaTrabajoSession == null}"
								value="ATENCIÓN: Solamente puede autoasignarse tareas, debido a que no se ha seleccionado un Area De Trabajo" />
						</p:panel>
					</p:outputPanel>
					<p:panel>

						<p:panelGrid columns="2">
							<h:outputText value="Asignarmela a mi #{msg.dos_puntos}" />
							<p:selectBooleanCheckbox value="#{tareaBean.asignarmelo}" disabled="#{tareaBean.areaTrabajoSession == null}">
								<p:ajax update="treePanel" listener="#{tareaBean.aver}" />
							</p:selectBooleanCheckbox>

						</p:panelGrid>

						<p:panelGrid columns="4">
							<h:outputText value="#{msg.tarea_vencimiento} #{msg.dos_puntos}" />
							<h:selectBooleanCheckbox value="#{tareaBean.selectedBoolean}">
								<p:ajax event="change" update="t2" />
							</h:selectBooleanCheckbox>

							<h:outputText value="#{msg.titulo_fecha} #{msg.dos_puntos}" />
							<p:calendar id="t2" disabled="#{!tareaBean.selectedBoolean}" value="#{tareaBean.tarea.fechaVencimiento}" pattern="MM/dd/yyyy HH:mm" />
						</p:panelGrid>


						<p:panelGrid columns="3">
							<h:outputLabel value="#{msg.campo_requerido} #{msg.titulo_duracion} #{msg.dos_puntos}" />
							<p:spinner label="#{msg.titulo_duracion}" min="0" id="number" value="#{tareaBean.tarea.duracionEstimada}" required="true" size="2">

							</p:spinner>

							<p:selectOneMenu value="#{tareaBean.selectedItem}" label="#{msg.campo_requerido} #{msg.titulo_unidad} #{msg.dos_puntos}">
								<f:selectItems value="#{tareaBean.selectItemsDuracionTarea}" required="true" />
							</p:selectOneMenu>
						</p:panelGrid>


						<p:panelGrid columns="2">

							<h:outputText value="#{msg.campo_requerido} #{msg.titulo_prioridad} #{msg.dos_puntos}" />
							<p:selectOneMenu value="#{tareaBean.selectedItemPrioridad}">
								<f:selectItems value="#{tareaBean.selectItemsPrioridadTarea}" required="true" />
							</p:selectOneMenu>

							<p:outputLabel value="#{msg.titulo_cantidad_recursos} #{msg.dos_puntos}" />
							<p:spinner label="#{msg.titulo_cantidad_recursos}" min="0" id="cantidadRecursos" value="#{tareaBean.number}"
								disabled="#{!tareaBean.assignToMe}" />
						</p:panelGrid>
					</p:panel>
				</p:panelGrid>
				<p:commandButton value="#{msg.titulo_guardar}" partialSubmit="true" ajax="false" action="#{tareaBean.guardar}" update="treePanel, formTarea" />

				<p:spacer width="15px"></p:spacer>
				<p:commandButton value="#{msg.titulo_limpiar}" actionListener="#{tareaBean.limpiarPantalla}" immediate="true" ajax="false"
					update="titulo, descripcion" />

			</h:form>
		</ui:define>
	</ui:composition>
</f:view>
</html>